 
<header id="header" class="mui-bar mui-bar-black mui-bar-nav">
    <a class="mui-icon mui-icon-left-nav mui-pull-left" href="{:url('user/index')}"></a>
    <h1 class="mui-title">新增工地</h1>
</header>
<form  method="POST" onsubmit='return checksubmit();' action="">
<br><br><br>
<div class="mui-content mui-content-my addProject">
    <div class="mui-input-row">
        <label>编号</label>
        <input placeholder="编号" name='row[building_contract_number]' type="text" value="<?php echo time(); ?>" readonly>
    </div>
    <div class="mui-input-row">
        <label>工地名称</label>
        <input type="text" name='row[building_name]' id='building_name' placeholder="请输入工地名称">
    </div>
    <div class="mui-input-row">
        <label>客户名称</label>
        <input type="text"  name='row[building_customer_name]'  id='building_customer_name'  placeholder="请输入客户名称">
    </div>
    <div class="mui-input-row">
        <label>工程名称</label>
        <input type="text" name='row[building_project_name]'  id='building_project_name'   placeholder="请输入工程名称">
    </div>
    <div class="mui-input-row" id="showCityPicker">
        <label>工地地址</label>
        <input type="text" id="cityResult" name='row[building_project_address]' readonly placeholder="请选择所在省市" class="my-icon-arrowright">
    </div>
    <div class="mui-input-row">
        <label></label>
        <input type="text" name='row[address]'  id='address' placeholder="详细地址">
    </div>
    <div class="mui-input-row"  data-options='{"type":"date"}' id='startTime'>
        <label>开始时间</label>
        <input id='result' type="text" name='row[building_begin_time]'  readonly placeholder="请选择开始时间" class="my-icon-arrowright">
    </div>
    <div class="mui-input-row">
        <label>工地金额</label>
        <input type="text" name='row[building_amount]' id='building_amount'  placeholder="请输入金额（单位：万）">
    </div>
    <div class="mui-input-row input-row-small">
        <div>
            <label>已付金额</label>
            <input type="text"  name='row[building_amount_paid]' id='paid' onblur="get_paid_rate();" placeholder=""><span>万</span>
        </div>
        <div>
            <label>已付比例</label>
            <input type="text" name='row[building_amount_paid_rate]' id='paid_rate' readonly  placeholder=""><span>%</span>
        </div>
    </div>
</div>
<div class="mui-content mui-content-my addProject" style="margin-top: 2em">
    <a href="javascript:openbz(4);">
        <div class="mui-input-row my-icon-arrowright">
        <label>添加班组长</label>
    </div></a>
    <input id='bzstr' name='row[bzstr]' type='hidden'>
    <div class="selected-user" id='bz'>
         
    </div>
</div>
<script type="text/javascript"> 
function get_paid_rate(){
    var building_amount = $('#building_amount').val();
    var paid = $('#paid').val();
    if(!building_amount||!paid)
        layer.msg('请输入工地金额或已付金额');
    else
        $('#paid_rate').val(($('#paid').val()/$('#building_amount').val()*100).toFixed(2)); 
}
function openbz(type){
   layer.open({
     title:"选择联系人",
     type: 2,
     area: ['100%', '100%'],
     shade: 0.3,
     shadeClose: false,//默认开启遮罩关闭
     resize: false,//默认重设大小是否
     maxmin: true,//默认最大最小化按钮
     scrollbar: true,//默认滚动条是否开启
     moveType: 1,//默认拖拽模式，0或者1
     content: "/index/site/add_person/id/"+type+".html", 
    //如果不让iframe出现滚动条，
    //可以content: ['http://sentsin.com', 'no']
     btn: ['确定','关闭'],
     yes: function (index) { 
         //获取选择的row,并加载到页面
         var row = window["layui-layer-iframe" + index].callbackdata();
         if(row){
            var str = '';
            for (var i=0;i<row.length;i++){  
                str += "<div><span>"+row[i]+"</span></div>"; 
            }
            if(type == 4){ 
                $('#bzstr').val(row.toString());
                $('#bz').html(str);  
            }
            else if(type == 5){
                $('#sgystr').val(row.toString());
                $('#sgy').html(str);  
            }
            else if(type == 6){
                $('#sggrstr').val(row.toString());
                $('#sggr').html(str); 
            } 
            layer.close(index)
         }else{
             layer.msg('请选择', {icon: 0});
         }
     },
     cancel: function(){
                //右上角关闭回调
     }
 });
}
function openzc(){
   layer.open({
     title:"选择资产",
     type: 2,
     area: ['100%', '100%'],
     shade: 0.3,
     shadeClose: false,//默认开启遮罩关闭
     resize: false,//默认重设大小是否
     maxmin: true,//默认最大最小化按钮
     scrollbar: true,//默认滚动条是否开启
     moveType: 1,//默认拖拽模式，0或者1
     content: "/index/site/add_property.html", 
    //如果不让iframe出现滚动条，
    //可以content: ['http://sentsin.com', 'no']
     btn: ['确定','关闭'],
     yes: function (index) { 
         //获取选择的row,并加载到页面
         var row = window["layui-layer-iframe" + index].callbackdata();
         if(row){
            var str = '';
            for (var i=0;i<row.length;i++){  
                str += "<div><span>"+row[i]+"</span></div>"; 
            } 
            $('#propertystr').val(row.toString());
            $('#property').html(str);   
            layer.close(index)
         }else{
             layer.msg('请选择', {icon: 0});
         }
     },
     cancel: function(){
                //右上角关闭回调
     }
 });
} 

</script>

<div class="mui-content mui-content-my addProject" style="margin-top: 2em">
    <a href="javascript:openbz(5);">
    <div class="mui-input-row my-icon-arrowright">
        <label>添加施工员</label>
    </div>
    </a>
    <input id='sgystr' name='row[sgystr]' type='hidden'>
    <div class="selected-user" id='sgy'>
         
    </div>
</div>
<div class="mui-content mui-content-my addProject" style="margin-top: 2em">
    <a href="javascript:openbz(6);">
    <div class="mui-input-row my-icon-arrowright">
        <label>添加工人</label>
    </div>
    </a>
    <input id='sggrstr' name='row[sggrstr]' type='hidden'>
    <div class="selected-user" id='sggr'>
         
    </div>
</div>
<div class="mui-content mui-content-my addProject" style="margin-top: 2em">
    <a href="javascript:openzc();">
    <div class="mui-input-row my-icon-arrowright">
        <label>添加资产</label>
    </div>
    </a>
    <input id='propertystr' name='propertystr' type='hidden'>
    <div class="selected-user" id='property'>
         
    </div>
</div>
<div class="mui-content mui-content-my addProject" style="margin-top: 2em" >
    <div class="mui-input-row my-icon-arrowright" style="background: none;">
        <label>工地风采</label>
    </div>
    <input id='building_info' name='row[building_info]' type='hidden'>
    <div class="selected-user-img">
        <div id="preview"></div>
        <div href="javascript:;" class="file">
            <input type="file" name=""   onchange="uploadpic(1,this);"  multiple id="file_upload">
        </div>
    </div>
</div>
<div class="mui-content mui-content-my addProject" style="margin-top: 2em">
    <div class="mui-input-row">
        <input style="width: 100%" type="submit" value="保存">
    </div>
</div>
</form>
<script src="__CDN__/style/js/jquery-1.11.3.js"></script>
<script src="__CDN__/style/js/layer/layer.js?v={$Think.config.site.version}"></script>  
<script src="__CDN__/style/js/mui.poppicker.js"></script>
<script src="__CDN__/style/js/mui.picker.min.js"></script>
<script src="__CDN__/style/js/city.data.js"></script>
<script type="text/javascript">
function checksubmit(){
    if($('#building_name').val()==''){
        layer.msg('请输入工地名称');
        return false; 
    }else if($('#building_customer_name').val()==''){
        layer.msg('请输入客户名称');
        return false; 
    }else if($('#building_project_name').val()==''){
        layer.msg('请输入工程名称');
        return false; 
    }else if($('#cityResult').val()==''){
        layer.msg('请选择所在省市');
        return false; 
    }else if($('#address').val()==''){
        layer.msg('请输入详细地址');
        return false; 
    }else if($('#result').val()==''){
        layer.msg('请选择开始时间');
        return false; 
    }else if($('#building_amount').val()==''){
        layer.msg('请输入金额（单位：万）');
        return false; 
    }else if($('#paid').val()==''){
        layer.msg('请输入已付金额（单位：万）');
        return false; 
    }else if($('#bzstr').val()==''){
        layer.msg('请输入班组长');
        return false; 
    }else if($('#sgystr').val()==''){
        layer.msg('请添加施工员');
        return false; 
    }else if($('#sggrstr').val()==''){
        layer.msg('请添加工人');
        return false; 
    }else if($('#propertystr').val()==''){
        layer.msg('请添加资产');
        return false; 
    }else if($('#file_upload').val()==''){
        layer.msg('请添加工地风采');
        return false; 
    }else{
        return true; 
    }
}

</script>
<script>
    (function($,doc) {
        $.init();
        var result = $('#result')[0];
        var btns = $('#startTime');
        btns.each(function(i, btn) {
            btn.addEventListener('tap', function() {
                var optionsJson = this.getAttribute('data-options') || '{}';
                var options = JSON.parse(optionsJson);
                var picker = new $.DtPicker(options);
                picker.show(function(rs) {
                    result.value = rs.text;
                    picker.dispose();
                });
            }, false);
        });
        var cityPicker = new $.PopPicker({
            layer: 2
        });
        cityPicker.setData(cityData);
        var showCityPickerButton = doc.getElementById('showCityPicker');
        var cityResult = doc.getElementById('cityResult');
        showCityPickerButton.addEventListener('tap', function(event) {
            cityPicker.show(function(items) {
                cityResult.value = items[0].text+" "+items[1].text;
                //返回 false 可以阻止选择框的关闭
                //return false;
            });
        }, false);
    })(mui,document);
    // $(function() {
    //     $("#file_upload").change(function() {
    //         var $file = $(this);
    //         var fileObj = $file[0];
    //         var windowURL = window.URL || window.webkitURL;
    //         var dataURL;
    //         var $img = $("#preview");

    //         if(fileObj && fileObj.files && fileObj.files[0]){
    //             dataURL = windowURL.createObjectURL(fileObj.files[0]);
    //             $img.css({width:'6em',height:'6em'}).html('<img src="'+dataURL+'">');
    //             //console.log(fileObj.files.length);
    //         }else{
    //             dataURL = $file.val();
    //             var imgObj = document.getElementById("preview");
    //             imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
    //             imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL;
    //         }
    //     });
    // });

          function  uploadpic(id,obj){
              // var index = layer.load(1, {shade: [0.5,'#000'] });
             lrz(obj.files[0], {width: 800}, function (results) {
            // 你需要的数据都在这里，可以以字符串的形式传送base64给服务端转存为图片。
              $.ajax({
                    url: "{:url('site/uploadpic')}", 
                    type: 'POST',
                    data : { 
                      base64:results.base64
                    },
                    dataType: 'json', //返回值类型，一般设置为json、application/json  这里要用大写  不然会取不到返回的数据 
                    beforeSend:function(result){
                        layer.load(1, {shade: [0.5,'#000'] });
                    }, 
                    success: function(data){  
                        layer.closeAll();
                        if(data.code=='0'){
                          $('#building_info').val(data.data); 
                          layer.msg('上传成功！');
                          $('#preview').append('<img style="width:6em;height:6em"  src="' + results.base64 + '" alt="" /><span class="del">×</span>')
                          // $('#preview').html('<img style="width:6em;height:6em"  src="' + results.base64 + '" alt="" /><span class="del">×</span>'); 
                        } 
                    },
                    error: function(data, status, e){ 
                      layer.closeAll();
                      $('#building_info').val(''); 
                      layer.msg('异常信息！请稍后再试！');  
                    }
              }); 
             });
            return false; 
        }



</script>
<script src="__CDN__/style/js/mobileFix.mini.js"></script>
<script src="__CDN__/style/js/exif.js"></script>
<script src="__CDN__/style/js/lrz.js"></script>  